<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<HTML>
<HEAD><TITLE>ttk_image manual page - Tk Themed Widget</TITLE>
<link rel="stylesheet" href="../docs.css" type="text/css" media="all">
</HEAD>
<BODY><H2><a href="../contents.htm">Tcl8.6.11/Tk8.6.11 Documentation</a> <small>&gt;</small> <a href="contents.htm">Tk Commands</a> <small>&gt;</small> ttk_image</H2>
<H3><A HREF="../UserCmd/contents.htm">Tcl/Tk Applications</A> | <A HREF="../TclCmd/contents.htm">Tcl Commands</A> | <A HREF="../TkCmd/contents.htm">Tk Commands</A> | <A HREF="../ItclCmd/contents.htm">[incr Tcl] Package Commands</A> | <A HREF="../SqliteCmd/contents.htm">SQLite3 Package Commands</A> | <A HREF="../TdbcCmd/contents.htm">TDBC Package Commands</A> | <A HREF="../TdbcmysqlCmd/contents.htm">tdbc::mysql Package Commands</A> | <A HREF="../TdbcodbcCmd/contents.htm">tdbc::odbc Package Commands</A> | <A HREF="../TdbcpostgresCmd/contents.htm">tdbc::postgres Package Commands</A> | <A HREF="../TdbcsqliteCmd/contents.htm">tdbc::sqlite3 Package Commands</A> | <A HREF="../ThreadCmd/contents.htm">Thread Package Commands</A> | <A HREF="../TclLib/contents.htm">Tcl C API</A> | <A HREF="../TkLib/contents.htm">Tk C API</A> | <A HREF="../ItclLib/contents.htm">[incr Tcl] Package C API</A> | <A HREF="../TdbcLib/contents.htm">TDBC Package C API</A></H3>
<DL>
<DD><A HREF="ttk_image.htm#M2" NAME="L1890">NAME</A>
<DL><DD>ttk_image &mdash; Define an element based on an image</DD></DL>
<DD><A HREF="ttk_image.htm#M3" NAME="L1891">SYNOPSIS</A>
<DL>
</DL>
<DD><A HREF="ttk_image.htm#M4" NAME="L1892">DESCRIPTION</A>
<DD><A HREF="ttk_image.htm#M5" NAME="L1893">OPTIONS</A>
<DL class="options">
<DD><A HREF="ttk_image.htm#M6" NAME="L1894"><B>-border</B> <I>padding</I></A>
<DD><A HREF="ttk_image.htm#M7" NAME="L1895"><B>-height </B><I>height</I></A>
<DD><A HREF="ttk_image.htm#M8" NAME="L1896"><B>-padding</B> <I>padding</I></A>
<DD><A HREF="ttk_image.htm#M9" NAME="L1897"><B>-sticky</B> <I>spec</I></A>
<DD><A HREF="ttk_image.htm#M10" NAME="L1898"><B>-width </B><I>width</I></A>
</DL>
<DD><A HREF="ttk_image.htm#M11" NAME="L1899">IMAGE STRETCHING</A>
<DD><A HREF="ttk_image.htm#M12" NAME="L1900">EXAMPLE</A>
<DD><A HREF="ttk_image.htm#M13" NAME="L1901">SEE ALSO</A>
<DD><A HREF="ttk_image.htm#M14" NAME="L1902">KEYWORDS</A>
</DL>
<H3><A NAME="M2">NAME</A></H3>
ttk_image &mdash; Define an element based on an image
<H3><A NAME="M3">SYNOPSIS</A></H3>
<B>ttk::style element create </B><I>name</I> <B><A HREF="../TkCmd/image.htm">image</A></B> <I>imageSpec</I> ?<I>options</I>?<BR>
<H3><A NAME="M4">DESCRIPTION</A></H3>
The <I>image</I> element factory creates a new element
in the current theme whose visual appearance is determined
by Tk images.
<I>imageSpec</I> is a list of one or more elements.
The first element is the default image name.
The rest of the list is a sequence of <I>statespec / value</I>
pairs specifying other images to use when the element is
in a particular state or combination of states.
<H3><A NAME="M5">OPTIONS</A></H3>
Valid <I>options</I> are:
<P>
<DL class="options">
<DT><A NAME="M6"><B>-border</B> <I>padding</I></A><DD>
<I>padding</I> is a list of up to four integers, specifying
the left, top, right, and bottom borders, respectively.
If fewer than four elements are specified,
<I>bottom</I> defaults to <I>top</I>,
<I>right</I> defaults to <I>left</I>, and
<I>top</I> defaults to <I>left</I>.
In other words, a list of three numbers specify the left, vertical, and right border;
a list of two numbers specify the horizontal and the vertical border;
a single number specifies the same border all the way around the element.
See <B><A HREF="#M11">IMAGE STRETCHING</A></B>, below.
<P><DT><A NAME="M7"><B>-height </B><I>height</I></A><DD>
Specifies a minimum height for the element.
If less than zero, the base image's height is used as a default.
<P><DT><A NAME="M8"><B>-padding</B> <I>padding</I></A><DD>
Specifies the element's interior padding.
The padding is a list of up to four length specifications
<I>left top right bottom</I>.
If fewer than four elements are specified,
<I>bottom</I> defaults to <I>top</I>,
<I>right</I> defaults to <I>left</I>, and
<I>top</I> defaults to <I>left</I>.
In other words, a list of three numbers specify the left, vertical, and right padding;
a list of two numbers specify the horizontal and the vertical padding;
a single number specifies the same padding all the way around the widget.
Defaults to <B>-border</B> if not specified.
<P><DT><A NAME="M9"><B>-sticky</B> <I>spec</I></A><DD>
Specifies how the image is placed within the final parcel.
<I>spec</I> contains zero or more characters
&ldquo;n&rdquo;,
&ldquo;s&rdquo;,
&ldquo;w&rdquo;,
or
&ldquo;e&rdquo;.
<P><DT><A NAME="M10"><B>-width </B><I>width</I></A><DD>
Specifies a minimum width for the element.
If less than zero, the base image's width is used as a default.
<P></DL>
<H3><A NAME="M11">IMAGE STRETCHING</A></H3>
If the element's allocated parcel is larger than the image,
the image will be placed in the parcel based on the <B>-sticky</B> option.
If the image needs to stretch horizontally (i.e., <B>-sticky ew</B>)
or vertically (<B>-sticky ns</B>),
subregions of the image are replicated to fill the parcel
based on the <B>-border</B> option.
The <B>-border</B> divides the image into 9 regions:
four fixed corners, top and left edges (which may be tiled horizontally),
left and right edges (which may be tiled vertically),
and the central area (which may be tiled in both directions).
<H3><A NAME="M12">EXAMPLE</A></H3>
<PRE>set img1 [image create photo -file button.png]
set img2 [image create photo -file button-pressed.png]
set img3 [image create photo -file button-active.png]
style element create Button.button image &#92;
    [list $img1  pressed $img2  active $img3] &#92;
    -border {2 4} -sticky we</PRE>
<H3><A NAME="M13">SEE ALSO</A></H3>
<B><A HREF="../TkCmd/ttk_intro.htm">ttk::intro</A></B>, <B><A HREF="../TkCmd/ttk_style.htm">ttk::style</A></B>, <B><A HREF="../TkCmd/ttk_vsapi.htm">ttk_vsapi</A></B>, <B><A HREF="../TkCmd/image.htm">image</A></B>, <B><A HREF="../TkCmd/photo.htm">photo</A></B>
<H3><A NAME="M14">KEYWORDS</A></H3>
<A href="../Keywords/S.htm#style">style</A>, <A href="../Keywords/T.htm#theme">theme</A>, <A href="../Keywords/A.htm#appearance">appearance</A>, <A href="../Keywords/P.htm#pixmap theme">pixmap theme</A>, <A href="../Keywords/I.htm#image">image</A>
<div class="copy">Copyright &copy; 2004 Joe English
</div>
</BODY></HTML>
